import React, { lazy, FC } from 'react'

import LoginPage from '~/pages/login'
import LayoutPage from '~/pages/layout'
import { PartialRouteObject } from 'react-router'
import WrapperRouteComponent from './config'
import { useRoutes } from 'react-router-dom'
import Dashboard from '~/pages/dashboard'

const NotFound = lazy(() => import(/* webpackChunkName: "404'"*/ '~/pages/404'))

const TransferManager = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/transfer-property-page/transfer-manager')
)

const Index = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/home'))

const UploadItems = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/upload-items-page/upload-items')
)

const ItemDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/upload-items-page/item-detail')
)

const ItemPicture = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/upload-items-page/Item-picture')
)

const ItemPictureLists = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/upload-items-page/img-lists')
)

const PropertyInvolved = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/transfer-property-page/property-involved')
)
const InfoAdmin = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/transfer-property-page/inform-admin')
)
const InformDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/transfer-property-page/inform-detail')
)
const BorrowProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/borrow-property-page/borrow-property')
)
const PropertyBorrow = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/borrow-property-page/property-borrow')
)
const PropertyBorrowed = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/borrow-property-page/property-borrowed')
)
const AcceptProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/accept-property')
)

const AcceptDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/accept-detail')
)
const ConfirmNotification = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/confirm-notification')
)
const ConfirmDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/confirm-detail')
)
const ConfirmTake = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/confirm-take')
)
const ConfirmTakeDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/confirm-take-detail')
)
const KeepSelf = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/keep-self')
)
const KeepSelfDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/keep-self-detail')
)
const Centralized = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/centralized-storage')
)
const CentralizedStorageDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/centralized-storage-detail')
)
const ConfirmBorrow = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/confirm-borrow')
)
const ConfirmBorrowDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/confirm-borrow-detail')
)

const ReturnProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/return-property')
)

const ReturnPropertyDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/return-property-detail')
)

const ReceiveProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/receive-property')
)

const ReceivePropertyDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/receive-property-detail')
)

const HandleProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/handle-property')
)

const HandlePropertyDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/property-management-page/handle-property-detail')
)

const InquireProperty = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/query-function-page/inquire-property')
)

const InquireStandbook = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/query-function-page/inquire-standbook')
)

const StandbookDetail = lazy(() => import('~/pages/query-function-page/standbook-detail'))

const InquireLaw = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/query-function-page/inquire-law')
)

const LawDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/query-function-page/law-detail')
)

const Approve = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/approve-property-page/approve-page')
)
const ApproveList = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/approve-property-page/approve-list-page')
)
const VoidCertificate = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accessibility/void-certificate')
)
const VoidCertificateDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accessibility/void-certificate-detail')
)
const UpdatingFiles = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accessibility/updating-files')
)
const UpdatingFilesDeatil = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accessibility/updating-files-deatil')
)

const Collection = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/collection'))

const CameraPage = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/camera-page'))

const QaPage = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/qa-page/qa-list'))

const QaDetailPage = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/qa-page/qa-item-detail'))

const Statistics = lazy(() => import(/* webpackChunkName: "permission-config'"*/ '~/pages/statistics/index'))

const DepositoryInformation = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/depository-information')
)

const DepositoryInformationDetail = lazy(() =>
  import(/* webpackChunkName: "permission-config'"*/ '~/pages/accept-property-page/depository-information-detail')
)

const routeList: PartialRouteObject[] = [
  {
    path: 'login',
    element: <WrapperRouteComponent element={<LoginPage />} titleId="" />
  },
  {
    path: '',
    element: <WrapperRouteComponent element={<LayoutPage />} titleId="" />,
    children: [
      {
        path: '/index',
        element: <WrapperRouteComponent element={<Index />} titleId="" />
      },
      {
        path: '/upload-items',
        element: <WrapperRouteComponent element={<UploadItems />} titleId="" />
      },
      {
        path: '/item-detail',
        element: <WrapperRouteComponent element={<ItemDetail />} titleId="" />
      },
      {
        path: '/item-picture',
        element: <WrapperRouteComponent element={<ItemPicture />} titleId="" />
      },
      {
        path: '/img-lists',
        element: <WrapperRouteComponent element={<ItemPictureLists />} titleId="" />
      },
      {
        path: '/void-certificate',
        element: <WrapperRouteComponent element={<VoidCertificate />} titleId="" />
      },
      {
        path: '/void-certificate-detail',
        element: <WrapperRouteComponent element={<VoidCertificateDetail />} titleId="" />
      },
      {
        path: '/updating-files',
        element: <WrapperRouteComponent element={<UpdatingFiles />} titleId="" />
      },
      {
        path: '/updating-files-deatil',
        element: <WrapperRouteComponent element={<UpdatingFilesDeatil />} titleId="" />
      },
      {
        path: '/dashboard',
        element: <WrapperRouteComponent element={<Dashboard />} titleId="" />
      },
      {
        path: '/transfer-manager',
        element: <WrapperRouteComponent element={<TransferManager />} titleId="" />
      },
      {
        path: '/property-involved',
        element: <WrapperRouteComponent element={<PropertyInvolved />} titleId="" />
      },
      {
        path: '/inform-admin',
        element: <WrapperRouteComponent element={<InfoAdmin />} titleId="" />
      },
      {
        path: '/inform-detail',
        element: <WrapperRouteComponent element={<InformDetail />} titleId="" />
      },
      {
        path: '/borrow-property',
        element: <WrapperRouteComponent element={<BorrowProperty />} titleId="" />
      },
      {
        path: '/property-borrow',
        element: <WrapperRouteComponent element={<PropertyBorrow />} titleId="" />
      },
      {
        path: '/property-borrowed',
        element: <WrapperRouteComponent element={<PropertyBorrowed />} titleId="" />
      },
      {
        path: '/accept-property',
        element: <WrapperRouteComponent element={<AcceptProperty />} titleId="" />
      },
      {
        path: '/accept-detail',
        element: <WrapperRouteComponent element={<AcceptDetail />} titleId="" />
      },
      {
        path: '/depository-information',
        element: <WrapperRouteComponent element={<DepositoryInformation />} titleId="" />
      },
      {
        path: '/depository-information-detail',
        element: <WrapperRouteComponent element={<DepositoryInformationDetail />} titleId="" />
      },

      {
        path: '/confirm-notification',
        element: <WrapperRouteComponent element={<ConfirmNotification />} titleId="" />
      },
      {
        path: '/confirm-detail',
        element: <WrapperRouteComponent element={<ConfirmDetail />} titleId="" />
      },
      {
        path: '/confirm-take',
        element: <WrapperRouteComponent element={<ConfirmTake />} titleId="" />
      },
      {
        path: '/confirm-take-detail',
        element: <WrapperRouteComponent element={<ConfirmTakeDetail />} titleId="" />
      },
      {
        path: '/keep-self',
        element: <WrapperRouteComponent element={<KeepSelf />} titleId="" />
      },
      {
        path: '/keep-self-detail',
        element: <WrapperRouteComponent element={<KeepSelfDetail />} titleId="" />
      },
      {
        path: '/centralized-storage',
        element: <WrapperRouteComponent element={<Centralized />} titleId="" />
      },
      {
        path: '/centralized-storage-detail',
        element: <WrapperRouteComponent element={<CentralizedStorageDetail />} titleId="" />
      },

      {
        path: '/inquire-property',
        element: <WrapperRouteComponent element={<InquireProperty />} titleId="" />
      },
      {
        path: '/inquire-standbook',
        element: <WrapperRouteComponent element={<InquireStandbook />} titleId="" />
      },
      {
        path: '/standbook-detail',
        element: <WrapperRouteComponent element={<StandbookDetail />} titleId="" />
      },
      {
        path: '/inquire-law',
        element: <WrapperRouteComponent element={<InquireLaw />} titleId="" />
      },
      {
        path: '/law-detail',
        element: <WrapperRouteComponent element={<LawDetail />} titleId="" />
      },
      {
        path: '/confirm-borrow',
        element: <WrapperRouteComponent element={<ConfirmBorrow />} titleId="" />
      },
      {
        path: '/confirm-borrow-detail',
        element: <WrapperRouteComponent element={<ConfirmBorrowDetail />} titleId="" />
      },
      {
        path: '/return-property',
        element: <WrapperRouteComponent element={<ReturnProperty />} titleId="" />
      },
      {
        path: '/return-property-detail',
        element: <WrapperRouteComponent element={<ReturnPropertyDetail />} titleId="" />
      },

      {
        path: '/receive-property',
        element: <WrapperRouteComponent element={<ReceiveProperty />} titleId="" />
      },
      {
        path: '/receive-property-detail',
        element: <WrapperRouteComponent element={<ReceivePropertyDetail />} titleId="" />
      },
      {
        path: '/handle-property',
        element: <WrapperRouteComponent element={<HandleProperty />} titleId="" />
      },
      {
        path: '/handle-property-detail',
        element: <WrapperRouteComponent element={<HandlePropertyDetail />} titleId="" />
      },
      {
        path: '/statistics',
        element: <WrapperRouteComponent element={<Statistics />} titleId="" />
      },
      {
        path: '/approve',
        element: <WrapperRouteComponent element={<Approve />} titleId="" />
      },
      {
        path: '/approve-list',
        element: <WrapperRouteComponent element={<ApproveList />} titleId="" />
      },
      {
        path: '/collection',
        element: <WrapperRouteComponent element={<Collection />} titleId="" />
      },
      {
        path: '/camera',
        element: <WrapperRouteComponent element={<CameraPage />} titleId="" />
      },
      {
        path: '/qa',
        element: <WrapperRouteComponent element={<QaPage />} titleId="" />
      },
      {
        path: '/qa-detail',
        element: <WrapperRouteComponent element={<QaDetailPage />} titleId="" />
      },

      {
        path: '*',
        element: <WrapperRouteComponent element={<NotFound />} titleId="" />
      }
    ]
  }
]

const RenderRouter: FC = () => {
  const element = useRoutes(routeList)
  return element
}

export default RenderRouter
